.container {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.unit-toggle {
  position: absolute;
  top: 20rpx;
  right: 20rpx;
}

.button-container {
  display: flex;
  width: 180rpx; 
  border-radius: 30rpx; 
  overflow: hidden; 
}

.button {
  flex: 1; 
  text-align: center; 
  padding: 10rpx; 
  font-size: 26rpx; 
  color: #fff; 
}

.left {
  background-color: #efefef; 
}

.right {
  background-color: #efefef; 
}

.active {
  background-color: #6bc1c2; 
  color: #fff; 
}


.progress-circle {
  margin-top: -105rpx;
  font-size: 48rpx;
  font-weight: bold;
}
.record-button {
  margin-top: 20rpx;
  width: 120px;
  height: 40px;
  background-color: #6bc1c2;
  color: white;
  border-radius: 20px;
}

.info-section {
  margin-top: 45rpx;
  display: flex;
  justify-content: space-around;
  width: 100%;
}

.info-item {
  width: 200rpx;
  height: 180rpx;
  background-color: #6bc1c21e;
  border-radius: 10px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  box-shadow: 0 4rpx 20rpx rgba(0, 0, 0, 0.027);
}

.info-label {
  font-size: 14px;
  color: #333;
  font-weight: bold;
}
.info-date {
  font-size: 24rpx;
  color: #999;
  margin-top: 10rpx;
}
.info-weight {
  margin-top: 10rpx;
  font-size: 44rpx;
  color: #6bc1c2;
  font-weight: bold;
}

.edit-icon {
  top: 10rpx;
  margin-right: 5rpx;
  margin-left: 55rpx;
  width: 30rpx;
  height: 30rpx;
}
.image-container{
  display: flex;
  justify-content:space-around;
}
/* 分割线和标题的容器样式 */
.divider-title {
  display: flex;
  align-items: center;
  margin: 20px 0; /* 上下边距 */
}

/* 分割线样式 */
.line {
  width: 250rpx;
  flex: 1; 
  height: 1px;
  background-color: #efefef; 
  margin-right: 10px; 
  margin-left: 10px;
}
/* 标题样式 */
.title {
  font-size: 16px; 
  color: #3a3a3acc; 
  font-weight: bold; 
}
.chart {
  width: 100%;
  height: 550rpx;
  margin-top: -100rpx;
}



